<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="../layuimini/lib/layui-v2.6.3/css/layui.css" media="all">
  <link rel="stylesheet" href="../layuimini/css/public.css" media="all">
</head>
<body>
<table id="table-user" class="layui-table" lay-filter="table-user"></table>
<script type="text/html" id="currentTableBar">
  <a class="layui-btn layui-btn-normal layui-btn-xs data-count-show" lay-event="show">查看</a>
  <a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
</script>
<script type="text/html" id="toolbar">
  <form class="layui-form">
    <div class="layui-form-item">
      <div class="layui-inline">
        <label class="layui-form-label" style="width:110px">合同名称</label>
        <div class="layui-input-inline">
          <input type="text" name="contractname" placeholder="支持模糊查询" autocomplete="off" class="layui-input">
        </div>
      </div>
      <div class="layui-inline">
        <button type="button" lay-submit class="layui-btn layui-btn-primary" lay-filter="data-search-btn"><i class="layui-icon"></i> 搜 索</button>
      </div>
    </div>
  </form>
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add">添加</button>
  </div>
</script>
<script src="../layuimini/lib/layui-v2.6.3/layui.js" charset="utf-8"></script>
<script th:inline="none">
  layui.use(['form', 'table'], function () {
    var $ = layui.jquery;
    var form = layui.form;
    var table = layui.table;

    table.render({
      elem: '#table-user',
      url: '/contract/conList',
      method:'post',
      page: true,
      limits: [1,5,10,15],
      limit: 10,
      cols: [[
        {field: 'contractName', title: '合同名称',width :200},
        {field: 'text', title: '合同内容'},
        {title: '操作', toolbar: '#currentTableBar', align: "center",width :180}
      ]],
      toolbar:"#toolbar",
    });

    table.on('tool(table-user)',function (obj){
      if (obj.event==='show'){
        var index=layer.open({
          title:'查看合同详情',
          type:2,
          shade:0.2,
          maxmin:true,
          shadeClose:true,
          area:['100%','100%'],
          content:'/contract/showConAndEmployee?id='+obj.data.id,
        });
        $(window).on("resize",function(){
          layer.full(index);
        });
        return false;
      }
      else if (obj.event === 'delete') {
        layer.confirm("确认删除吗？",function(index) {
          $.post('/contract/delete',{"conId":obj.data.id},function(res){
            if(res.data==="success"){
              layer.msg(res.msg);
              //重新加载表格
              table.reload('table-user');
            }
          });
          layer.close(index);
        })
      }


    })


    table.on('toolbar(table-user)', function (obj) {
      if (obj.event === 'add') {  // 监听添加操作
        var index = layer.open({
          title: '添加合同',
          type: 2,
          shade: 0.2,
          maxmin:true,
          shadeClose: true,
          area: ['100%', '100%'],
          content: '/contract/addContract',
        });
        $(window).on("resize", function () {
          layer.full(index);
        });
      } else if (obj.event === 'delete') {  // 监听删除操作
        var checkStatus = table.checkStatus('currentTableId')
                , data = checkStatus.data;
        layer.alert(JSON.stringify(data));
      }
    });

    form.on('submit(data-search-btn)',function(data){
      var result=JSON.stringify(data.field);
      console.log(result);
      //执行搜索重载
      table.reload('table-user',{
        page:{
          curr:1
        },
        where:{
          contractname:data.field.contractname,
        }
      },'data');
      //阻止表单提交
      return false;
    })

  });
</script>

</body>
</html>